<template>
  <div class="started">
    <Create/>
    <div class="type_box">
      <el-menu
          :default-active=active
          class="el-menu-demo"
          mode="horizontal"
          router
      >
        <el-menu-item index="/OA/my-leave/list">全部</el-menu-item>
        <el-menu-item index="/OA/my-leave/going">进行中</el-menu-item>
        <el-menu-item index="/OA/my-leave/passed">审批通过</el-menu-item>
        <el-menu-item index="/OA/my-leave/refuse">审批拒绝</el-menu-item>
      </el-menu>
      <router-view></router-view>
    </div>
  </div>
</template>

<script setup>
import Create from "@/components/OA/Leave/Created/Create.vue"
import {ElMenu, ElMenuItem} from "element-plus"
import {Discount} from "@element-plus/icons-vue"
import {useRouter} from "vue-router"
import {onMounted, ref} from "vue"
import emitter from "@/lib/eventBus"

const router = useRouter()
const active = ref('/OA/my-leave/list')

emitter.on('updateMyLeave',(key)=>{
  active.value = key
})

onMounted(()=>{
  emitter.emit('home_menu','/OA/my-leave/list')
  // router.push('/OA/my-leave/list')
})


</script>

<style scoped lang="less">
.started{
  height: 100vh;
  width: 100vw;
  //display: flex;
  .type_box{
    margin-top: 1.5vh;
    margin-left: 9vw;
    width: 89.5%;
    height: 96.5%;
    box-sizing: border-box;
    border-radius: 10px;
    box-shadow: 0 0 7px 7px lightgray;
    background-color: rgba(250, 250, 250);
    .el-menu-demo{
      width: 99.5%;
      margin: 5px auto;
    }
  }
}
</style>
